<template>
    <a-control-group>
        <a-button
            class="a-input-radio-button"
            :color="myColor"
            :size="mySize"
            :sharp="mySharp"
            :disabled="myDisabled || getDisabledFunc(a)"
            :plain="plain"
            v-for="a in items"
            :key="getTextFunc(a)"
            @click="input(a)"
            ><span
                class="fa fa-fw"
                :class="[
                    value === getValueFunc(a)
                        ? 'fa-dot-circle-o'
                        : 'fa-circle-o',
                ]"
            ></span
            >{{ getTextFunc(a) }}</a-button
        >
    </a-control-group>
</template>

<script>
import AButton from './AButton.vue'
import AControlGroup from './AControlGroup.vue'
import inputMixin from "../mixins/inputMixin"

export default {
    name: 'AInputRadioButton',
    components: { AButton, AControlGroup },
    mixins: [inputMixin],
    props: {
        value: null,
        plain: {
            type: Boolean,
            default: false,
        },
        items: {
            type: Array,
            default: [],
        },
        getTextFunc: {
            type: Function,
            default: a => a.text,
        },
        getValueFunc: {
            type: Function,
            default: a => a.value,
        },
        getDisabledFunc: {
            type: Function,
            default: a => a.disabled,
        },
    },
    methods: {
        input(item) {
            this.$emit('update:value', this.getValueFunc(item))
        },
    },
}
</script>